<%--
  @author Kusal Samarakoon
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="s" uri="/struts-tags" %>
<script type="text/javascript" src="${pageContext.request.contextPath}/lib/jquery/timepicker/jquery.timePicker.js"></script>
<link rel="stylesheet" href="${pageContext.request.contextPath}/css/timePicker.css"/>

<script type="text/javascript">

    $(function() {

        hideNominee();
        $("#appointment_time").timePicker({
            startTime: new Date(0, 0, 0, 08, 00, 0),
            endTime: new Date(0, 0, 0, 18, 00, 0),
            show24Hours: true,
            separator:':',
            step: 30});


        var pls_enter_refNo = "Please Enter Ref No.";
        var pls_enter_valid_date = "Please Enter Valid Date";
        $("#create-appointment-schedule").validate({
            rules:{
                endingDate:{
                    required: true
                }
            },
            messages:{
                endingDate:{
                    required: "<br/>" + pls_enter_valid_date
                }
            }
        });


    });

    function validateNominee() {
        if ($('#are_you_attendOrNot0').is(':checked')) {
            var pls_enter_Nominee = "Please Enter Nominee";
            $('#nominee').rules("add", {
                required: true,
                messages:{
                    ageValidate:$('#pls_enter_Nominee').val()}
            });
        }

    }

    function attendClick() {

        //alert($('#are_you_attendOrNot0').is(':checked'));
        if ($('#are_you_attendOrNot0').is(':checked')) {
            showNominee();
        } else {
            hideNominee();
        }
    }

    function hideNominee() {
        $('#nominee_display').hide();
        $('#nominee').val('');
    }

    function showNominee() {
        $('#nominee_display').show();
    }

</script>

<div id="land-registration-module-home-title" class="module-home-title">
    <s:a href="landAlienationModuleHome.do"><img src="${pageContext.request.contextPath}/images/interest-party.png"
                                                        alt="Land Alienation"><span><s:label
            value="%{getText('land_alienation.label')}"/></span></s:a>
    <span class="module-title-breaker"> > </span>
    <s:a href="loadDetailedApplicationListToSchedule.do"><img src="${pageContext.request.contextPath}/images/schedule-task.png"
                                                                     alt="Land Alienation"><span><s:label
            value="%{getText('schedule_appointment.label')}"/></span></s:a>
</div>
<div id="init-land-update-list">
    <div class="page-title">
        <h2><s:label value="%{getText('schedule_appointment.label')}"/></h2>
    </div>
    <s:if test="hasActionErrors() || hasActionMessages()">
        <div id="message-box" class="message-box">
            <div class="action-msg"><s:actionmessage/></div>
            <div class="action-err"><s:actionerror/></div>
        </div>
    </s:if>
    <s:form id="create-appointment-schedule" name="create-appointment-schedule"
            method="POST"
            onsubmit="javascript:return validateFormForInputDataSyntaxErrors('create-appointment-schedule')"
            >
        <br/>
        <fieldset id="land-schedule-form" style="border:none;">
            <table class="width-100">
                <tr>
                    <td><s:label value="%{getText('appointment_date.label')}" cssClass="mandatory-field"/></td>
                    <td colspan="3"><s:textfield id="endingDate" name="appointmentSchedule.appointmentDate"
                                                 onKeyPress="return dateNumbersOnly(event,true)"/></td>
                </tr>
                <tr>
                    <td><s:label value="%{getText('appointment_time.label')}"/></td>
                    <td colspan="3"><s:textfield id="appointment_time" name="appointmentSchedule.appointmentTime"
                                                 cssClass="width-120-px"/></td>
                </tr>
                <tr>
                    <td><s:label value="%{getText('appointment_description.label')}"/></td>
                    <td colspan="3"><s:textarea id="appointment_description" name="appointmentSchedule.description"
                                                cssClass="width-595-px"/></td>
                </tr>
                    <%--<tr>
                        <td><s:label value="%{getText('are_you_attend.label')}"/></td>
                        <td colspan="3"><s:textfield id="are_you_attend" name="appointmentSchedule.attend"/></td>
                    </tr>--%>
                <tr>
                    <td><s:label value="%{getText('are_you_attend.label')}"/></td>
                    <td colspan="2"><s:radio id="are_you_attendOrNot" name="appointmentSchedule.attend"
                                             list="#@java.util.HashMap@{'1':getText('yes.label'),'0':getText('no.label')}"
                                             onclick="attendClick()" value="1"/></td>
                </tr>


                <tr id="nominee_display">
                    <td><s:label value="%{getText('nominee.label')}" cssClass="mandatory-field"/></td>
                    <td colspan="3"><s:textfield id="nominee" name="appointmentSchedule.nominee"/></td>
                </tr>
            </table>
            <hr/>
            <div class="form-button-div right-align">
                <s:submit action="saveAppointmentSchedule" value="%{getText('save.label')}"
                          onclick="validateNominee()"/>
                <s:submit cssClass="cancel" action="loadDetailedApplicationListToSchedule"
                          value="%{getText('back.label')}"/>
            </div>
        </fieldset>
        <s:hidden id="applicationId" name="applicationId"/>
    </s:form>
</div>


